<div class="f-utils-fill-flex-row">
    <div class="w-50 border-right f-utils-overflow-auto">
        <div *ngFor="let tpl  of presetTplList" class="border-bottom p-2 tplItem"
            [class.active]="tpl.id===selectedTpl.id" (click)="changeTpl(tpl.id)">
            {{tpl.title}}</div>
    </div>
    <div class="flex-fill pt-3 px-2" *ngIf="selectedTpl">
        <div class="border p-2 tplDiv">
            <img class="tmplImg" [src]="selectedTpl.templatePic" (click)="showPreviewImage()" />
        </div>
        <!-- <div class="tmplInfo">模板描述： {{selectedTpl && selectedTpl.templateDescription}}</div> -->
    </div>
</div>
<div class="preview-template-image" *ngIf="showPreview" (click)="hidePreviewImage()">
    <img class="tmplImg" [src]="selectedTpl.templatePic" />
</div>


<div class="btns modal-footer">
    <button type="button" class="btn btn-secondary" (click)="clickCancel()">取消</button>
    <button type="button" class="btn btn-primary" (click)="clickConfirm()">确定</button>
</div>